#include('header.html', {title: '后台管理·系统用户', users: 'active'})

<style>
  .header-tools .layui-input {
    height: 32px !important;
  }

  .layui-btn+.layui-btn {
    margin-left:2px;
  }
</style>

<div class="body-wrapper">
  <div class="layui-card">
    <div class="layui-card-header">
      <h3 class="card-title font-yy">
        用户管理
      </h3>
      <div class="header-tools">
        <form class="layui-form">
          <div class="layui-inline width-100">
            <select name="category" class="layui-select" lay-filter="category">
              <option value="">全部</option>
              <option value="0">邮箱</option>
              <option value="1">账号</option>
              <option value="2">姓名</option>
            </select>
          </div>
          <div class="layui-inline width-120">
            <input name="content" class="layui-input" lay-verType="tips" lay-verify="kayVer" placeholder="关键字">
          </div>
          <div class="layui-inline">
            <button lay-submit lay-filter="_search" class="layui-btn-sm layui-btn layui-btn-normal">
              搜索
            </button>
          </div>
        </form>
      </div>
    </div>
    <div class="layui-card-body">
      <table id="users" lay-filter="userTable"></table>

      <script type="text/html" id="tools">
        <a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="edit">修改</a>
        {{# if(d.audit === 0) { }}
        <a class="layui-btn layui-btn-xs" lay-event="audit">通过审核</a>
        {{# } else { }}
        <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="audit">驳回审核</a>
        {{# } }}
      </script>
    </div>
  </div>
</div>

<script type="text/html" id="userTpl">
  <div class="layui-card">
    <form class="layui-form">
      <input type="hidden" name="uid" value="{{d.id}}">
      <div class="layui-card-body">
        <div class="layui-form-item">
          <select name="role" class="layui-select" lay-verType="tips" lay-verify="required">
            <option value="1" {{d.role==1?'selected':''}}>学生</option>
            <option value="2" {{d.role==2?'selected':''}}>老师</option>
          </select>
        </div>
        <button class="layui-btn layui-btn-sm layui-btn-fluid layui-btn-warm"
                lay-submit lay-filter="userEdit">修改</button>
      </div>
    </form>
  </div>
</script>

<script>
  var dialogIndex = 0;
  layui.use(['table', 'form', 'jquery', 'layer', 'laytpl'], function () {
    var table = layui.table;
    var form = layui.form;
    var $ = layui.jquery;
    var layer = layui.layer;
    var laytpl = layui.laytpl;
    var $userTpl = $('#userTpl');

    // 获取审核状态
    function getAudit(d) {
      var audit = d.audit;
      if (audit === 0) {
        return '<span class="layui-badge layui-bg-orange">未审核</span>';
      } else {
        return '<span class="layui-badge layui-bg-blue">已审核</span>';
      }
    }

    function getRole(d) {
      var role = d.role;
      if (role === 3) {
        return '<span class="layui-badge layui-bg-cyan">管理员</span>'
      } else if (role === 2) {
        return '<span class="layui-badge layui-bg-green">老师</span>'
      } else {
        return '<span class="layui-badge layui-bg-gray">学生</span>'
      }
    }

    table.render({
      elem: '#users',
      page: true,
      url: '/admin/systemuser/category',
      method: 'post',
      cols: [[
        {type: 'numbers', title: '序号'},
        {field: 'name', title: '姓名'},
        {
          title: '性别', templet: function (d) {
            var sex = d.sex;
            if (sex === 0) return '<span class="layui-badge layui-bg-black">男</span>';
            else return '<span class="layui-badge layui-bg-red">女</span>';
          }, width: 80
        },
        {field: 'username', title: '账号'},
        {field: 'email', title: '邮箱'},
        {field: 'regTime', title: '创建时间'},
        {title: '身份', templet: getRole, width: 100},
        {title: '状态', templet: getAudit, width: 100},
        {title: '操作', toolbar: '#tools', width: 135}
      ]],
      parseData: function (res) {
        return {
          "code": res.code,
          "msg": res.msg,
          "count": (res.payload ? res.payload.totalRows : 0),
          "data": (res.payload ? res.payload.rows : [])
        };
      }
    });

    var methods = {
      audit: function (data) {
        var id = data.id;
        var audit = data.audit;
        $.post('/admin/systemuser/audit', {userId: id}, function (data) {
          if (data.success) {
            if (audit === 0) {
              layer.msg('审核通过', {icon: 6, time: 1200});
            } else {
              layer.msg('驳回审核', {icon: 5, time: 1200});
            }
            table.reload('users');
          }
        });
      },
      edit: function (user) {
        laytpl($userTpl.html()).render(user, function (html) {
          dialogIndex = layer.open({
            type: 1,
            title: '用户信息修改['+user.username+']',
            content: html
          });
          form.render('select');
        });
      }
    };
    table.on('tool', function (obj) {
      var m = methods[obj.event];
      if (m != null) {
        m(obj.data);
      }
    });

    form.on('submit(userEdit)', function (obj) {
      var field = obj.field;
      $.post('/user/update/role', field, function (data) {
        if (data.success) {
          layer.msg('修改成功！', {icon: 6, time: 1200});
        } else {
          layer.msg('修改失败！', {icon: 5, time: 1200});
        }
        layer.close(dialogIndex);
        table.reload('users');
      });
      return false;
    });

    form.on('select(category)', function (d) {
      if (d.value == null || d.value === '') {
        table.reload('users', {where: {}});
      }
    });

    form.on('submit(_search)', function (obj) {
      var field = obj.field;
      if (field.category !== '') {
        table.reload('users', {
          where: field
        });
      }
      return false;
    });
    form.verify({
      kayVer: function (val, elem) {
        var sval = $('[name="category"]').val();
        if (sval != null && sval !== '') {
          if (val === '' || val.length <= 0) {
            return "必填项不能为空！";
          }
        }
      }
    });

  });
</script>

#include('footer.html')
